<div class="podcastliquidtag" style="background: #<%= podcast.main_color_hex %>" data-meta="<%= episode.decorate.mobile_player_metadata.to_json %>">
  <div class="podcastliquidtag__info">
    <a href="/<%= podcast.slug %>/<%= episode.slug %>">
      <h1 class="podcastliquidtag__info__episodetitle"><%= episode.title %></h1>
    </a>
    <a href="/<%= podcast.slug %>" style="display:block">
      <h2 class="podcastliquidtag__info__podcasttitle">
        <%= podcast.title %>
      </h2>
    </a>
  </div>
  <div id="record-<%= episode.slug %>" data-podcast="<%= podcast.slug %>" data-episode="<%= episode.slug %>" class="podcastliquidtag__record">
    <img class="button play-butt" id="play-butt-<%= episode.slug %>" src="<%= asset_path("playbutt.png") %>" alt="play">
    <img class="button pause-butt" id="pause-butt-<%= episode.slug %>" src="<%= asset_path("pausebutt.png") %>" alt="pause">
    <%= optimized_image_tag(podcast.image_url,
                            optimizer_options: { crop: "crop" },
                            image_options: { class: "podcastliquidtag__podcastimage", id: "podcastimage-#{episode.slug}", alt: podcast.title }) %>
  </div>

  <%= render "podcast_episodes/podcast_bar", podcast: podcast, episode: episode %>
</div>
